<template>
  <div id="app">
    <div class="box">
      <div class="left"></div>
      <div class="mid"></div>
      <div class="right"></div>
    </div>
  </div>
</template>

<script>
import HelloWorld from "./components/HelloWorld.vue";

export default {
  name: "App",
  components: {},
};
</script>
<style >
*{
  padding: 0;
  margin: 0;
}
</style>
<style lang="less" scoped>
// scoped局部样式
#app {
  .box {
    display: flex;
    width: 100%;
    height: 100vh;
    .left {
      flex: 1;
      background-color: tomato;
    }
    .mid {
      flex: 1;
      background-color: orangered;
    }
    .right {
      flex: 1;
      background-color: orange;
    }
  }
}
</style>
